import { onMounted, ref, watch } from 'vue'
import { useRoute } from 'vue-router'

export default function useCateInfo(key) {
  const cateInfo = ref({})

  const getCateInfo = async (id) => {
    const data = await getCateInfoFromLocal(id)
    cateInfo.value = data
  }

  const route = useRoute()
  watch(() => route.params.category, (nv) => getCateInfo(nv))
  onMounted(() => getCateInfo(key))

  async function getCateInfoFromLocal(title) {
    const cateList = await import('../../../_data~/cateList.json')
    return cateList.default.find(item => item.title === title)
  }

  return {
    cateInfo
  }
}